<template>
  <app-dialog class="orderdetail_dialog" v-model="show" width="1000px" :title="detailedType == 0 ? '预约清单' : '即时清单'"
    @open="handleOpen">
    <div class="orderdetail">
      <div class="orderdetail_title">
        <!-- <div class="titleitem">
          <div class="titleitem_label">赛事类型</div>
          <div class="titleitem_value">{{ matchtype }}</div>
        </div> -->
        <div class="titleitem">
          <div class="titleitem_label">比赛时间</div>
          <div class="titleitem_value">{{ state.orderData.match.match_time == null ? state.orderData.match.matchTime :
            state.orderData.match.match_time }}</div>
        </div>
        <div class="titleitem">
          <div class="titleitem_label">联赛</div>
          <div class="titleitem_value">{{ state.orderData.match.league_name }}</div>
        </div>
        <div class="titleitem">
          <div class="titleitem_label">赛事</div>
          <!-- <div class="titleitem_value">{{data.orderData.match.home_name}} vs {{data.orderData.match.away_name}}</div> -->
          <div class="pk titleitem_value">
            <div class="pk-item">{{ state.orderData.match.home_name }}</div>
            <div class="vs"></div>
            <div class="pk-item">{{ state.orderData.match.away_name }}</div>
          </div>
        </div>
      </div>
      <div class="orderdetail_table">
        <el-table style="border: solid 1px #ebebeb; border-radius: 8px; height: 350px" :data="detaildata">
          <el-table-column label="平台" prop="bc_type" show-overflow-tooltip>
            <template #default="scope">
              <div>{{ store.bctypeLabel(scope.row.bc_type) }}</div>
            </template>
          </el-table-column>
          <el-table-column label="盘口" show-overflow-tooltip>
            <template #default="scope">
              <div>{{ scope.row.pk_odds_key_ch }}</div>
            </template>
          </el-table-column>
          <el-table-column label="赔率" show-overflow-tooltip>
            <template #default="scope">
              <div v-if="detailedType == 0">{{ scope.row.min_odd }} ~ {{ scope.row.max_odd }}</div>
              <div v-else>{{ scope.row.odd }}</div>
            </template>
          </el-table-column>
          <el-table-column label="下单金额" show-overflow-tooltip>
            <template #default="scope">
              <div v-if="scope.row.reservation_stake_type == 'max'">最大限额</div>
              <div v-if="scope.row.reservation_stake_type == 'min'">最小限额</div>
              <div v-if="scope.row.reservation_stake_type != 'max' && scope.row.reservation_stake_type != 'max'">
                {{ scope.row.reservation_stake }}
              </div>
            </template>
          </el-table-column>
          <el-table-column label="赛前进场时间" show-overflow-tooltip v-if="detailedType == 0">
            <template #default="scope">
              <div>{{ scope.row.before_timer_min }}’ ~ {{ scope.row.before_timer_max }}’</div>
            </template>
          </el-table-column>
          <el-table-column label="赛中进场" show-overflow-tooltip v-if="detailedType == 0">
            <template #default="scope">
              <div v-if="scope.row.is_ing_timer == 0">否</div>
              <div v-else>是（{{ scope.row.ing_timer_min }}’ ~ {{ scope.row.ing_timer_max }}’）</div>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>

    <template #footer>
      <el-button @click="handleClose">取消</el-button>
      <el-button type="primary" @click="handleSubmit">确定</el-button>
    </template>
  </app-dialog>
</template>
<script setup>
import { ElMessage } from 'element-plus'
import { http } from '@/utils/http'

const show = defineModel({ type: Boolean })
const emits = defineEmits(['change'])
const { store, state } = inject('Home')
const props = defineProps({
  data: Object,
  detailedType: Number,
})

const matchtype = computed(() => {
  let foundObject = state.options.find(obj => obj.type === 'event_type_from')
  if (foundObject) {
    let foundObject2 = foundObject.options.find(obj => obj.value === state.orderData.match.event_type)
    if (foundObject2) {
      return foundObject2.label
    } else {
      return ''
    }
  } else {
    return ''
  }
})

const handleClose = () => {
  show.value = false
}

const detaildata = computed(() => {
  let a = []
  // if (props.detailedType == 0) {
  let data = props.data.dataarr
  data.forEach(item => {
    item.place_data.forEach(item2 => {
      a.push(item2)
    })
  })
  // } else {
  //   console.log(props.data)
  //   let data = props.data.dataarr.place_data

  //   data.forEach(item => {
  //     a.push(item)
  //   })
  // }
  // console.log(a)

  return a
})
// 打开弹窗
const handleOpen = () => {
  console.log(state.orderData)
}

const getbctypename = type => {
  let foundObject = state.options.find(obj => obj.type === 'platform_from')
  if (foundObject) {
    let foundObject2 = foundObject.options.find(obj => obj.value === type)
    if (foundObject2) {
      return foundObject2.label
    } else {
      return ''
    }
  } else {
    return ''
  }
}

// 提交
const handleSubmit = () => {
  let a = JSON.parse(JSON.stringify(props.data.dataarr))
  let b = []
  // if (props.detailedType == 0) {
  a.forEach(item => {
    let place_data = item.place_data
    let newplace_data = place_data.map(obj => {
      let { pk_odds_key_ch, ...rest } = obj // 使用解构赋值删除 item 字段
      return rest // 返回没有 item 字段的新对象
    })
    item.place_data = newplace_data
    if (state.schemeActive.type == 1) {
      item.scheme_code = state.schemeActive.scheme_code
      item.source_order_id = state.schemeorder.id
    }

    b.push(item)
  })
  console.log(b);
  localStorage.setItem('kiteorderData', JSON.stringify(b[0].place_data[0]));
  if (state.schemeActive.type == 0) {
    http.post('/order/creat_place_order', b).then(res => {
      if (res.code == 200) {
        ElMessage.success(res.msg || '下单成功')
        handleClose()
        emits('change', props.data.dataarr)
      } else {
        ElMessage({
          message: res.msg,
          type: 'warning',
        })
      }
    })
  } else {
    http.post('/order/creat_copy_order', b).then(res => {
      if (res.code == 200) {
        ElMessage.success(res.msg || '下单成功')
        handleClose()
        emits('change', props.data.dataarr)
      } else {
        ElMessage({
          message: res.msg,
          type: 'warning',
        })
      }
    })
  }
  


}
</script>



<style lang="scss" scoped>
.orderdetail_table {
  margin: 24px 24px 40px;
}

::v-deep .orderdetail_table thead tr th {
  font-family: PingFangSC;
  font-size: 14px;
  color: #778090;
}

::v-deep .orderdetail_table tbody tr td {
  // margin: 12px 72px;
  font-family: PingFangSC;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #252a30;
}

.orderdetail_title {
  //   width: 100%;
  height: 100px;
  padding: 0 24px;
  background-color: rgba(71, 172, 255, 0.25);
  display: flex;
  // justify-content: flex-start;
  justify-content: space-around;
  align-items: center;
}

// .orderdetail_title .titleitem:not(:last-child) {
//   margin-right: 20px;
// }
.orderdetail_title .titleitem .titleitem_label {
  font-family: PingFangSC;
  font-size: 14px;
  color: #252a30;
}

.orderdetail_title .titleitem .titleitem_value {
  font-family: PingFangSC;
  font-size: 16px;
  font-weight: 600;
  color: #252a30;
}

.pk {
  display: flex;
  align-items: center;

  .vs {
    margin: 0 8px;
    width: 16px;
    height: 16px;
    background: url('@/assets/vs.png') no-repeat 0 center;
    background-size: cover;
  }
}
</style>

<style>
.orderdetail_dialog .el-dialog__body .app-dialog__header {
  font-family: PingFangSC;
  font-size: 16px;
  font-weight: 600;
  color: #252a30;
}

.orderdetail_dialog .el-dialog__body .app-dialog__body {
  padding: 0 !important;
}
</style>